今天一樣是語法糖的練習，而且我想把日期塞進去 （感謝 sololearn 的 David Carroll 大大說明)

首先我們在 index.html 裡再新增一個

<div id="root3"></div>

接著，我們到 index.js 中新增下列寫法

const dateTime = (new Date()).toString(); // 這裡把日期轉為文字
const today = 'today'; //這裡宣告了一個字串
const element2  = <p id={today}> {dateTime} </p>;
//我們用語法糖{}把變數today當成"today"來使用，用語法糖{dateTime}來呼叫變數裡的值
//最後再把一切輸出到element2中執行到div#root3裡
ReactDOM.render(
  element2,
  document.getElementById('root3')
)

呈現的結果如下：

如果有網頁設計師朋友應該很熟悉右邊的工具，不過還是說明一下，通常按F12就會開啟瀏覽器的偵測模式工具喔，是很方便的功能，特別是在模擬 RWD 網站的時候，非常方便喲，有興趣的話可以 Google 相關資料。

接著今天我們要再做個小練習，一樣是出自於sololearn，是個簡單的計時器（雖然說簡單，但我把 , 看成 . 所以也是錯誤了一下，要很細心哩）。

因為懶惰（對），所以我們再新增一個div#root4在同一頁裡，然後回到 index.js 中，寫下

let counter = 0;
function counterFun() {
  counter++;
  const el = <p>{counter}</p>;
  ReactDOM.render(el, 
    document.getElementById('root4')
  );
}
setInterval(counterFun, 1000);

就可以得到下面自動計時的畫面唷：